/**
 *
 * @cnName 具有提示功能的输入框
 * @enName textbox
 * @introduce
 * <p>通过给简单的表单输入域设置不同的配置项可以使表单拥有舒服的视觉效果，也可以使其具有提示补全功能</p>
 */
define(["avalon",
    "text!./avalon.textbox.html",
    "css!./avalon.textbox.css","../base/normalThings",'../tooltip/avalon.tooltip'], function(avalon, template) {

    var _interface = function () {}

    avalon.component("aoyou:textbox", {
        // 内部变量
        $tp:{},
        fronttitle:"",
        lastalert:"",
        mtype:"",
        iconshow:false,
        _placeholderVisible: true,
        _focusing: false,
        _hovering: false,
        isValid:false,//验证通过
        _isLowerEndBrowser: document.all && !window.atob, // IE 9 or lower

        // 内部方法
        _clickPlaceholder: _interface,
        _focus: _interface,
        _blur: _interface,
        _hover: _interface,
        valiinput:_interface,
        _setValue:_interface,
        _inputClick:_interface,
        _getValue:_interface,
        // 配置项
        icontype:"",
        value: "",
        placeholder: "",
        type: "input",
        disabled: false,
        suggest: null,
        width:"",
        height:"",
        validation:"",
        designatedoutervmid:'',
        // 对外方法
        validating:_interface,
        // 模板
        $template: template,
        $construct: function (defaultConfig, vmConfig, eleConfig) {
            if(eleConfig.value){
                defaultConfig.$template = defaultConfig.$template.replace(/value/g,eleConfig.value);
            }
            var options = avalon.mix(defaultConfig, vmConfig, eleConfig)
            return options
        },

        $init: function (vm,el) {
            vm.$tp = {
                mouseclickout:true,
                mouseleave:false,
                linkobj:el,
                backgroundcolor:'#F08080'
            }
            if(vm.icontype != ""){
                vm.iconshow = true;
                vm.mtype = "aoyou-textbox-icon-"+vm.icontype;
            }
            vm.valiinput = function(zm,v,txt,ev){
                vm.isValid = false;
                if(v.indexOf('req') == -1 && txt == ''){
                    vm.isValid = true;//如果没有要求必须填写则可以为空
                }
                var info = avalon.normalvalidation(txt,v);
                zm.content = info;
                if(info == "" || vm.isValid){
                    vm.isValid = true;
                    zm.hidetip();
                }else{
                    zm.showtip(ev);
                }
            }
        },
        $ready: function (vm,elem) {
            vm._clickPlaceholder = function(e){
                var input = nextElementSibling(e.target)
                input.focus()
            }
            vm._focus = function(){
                vm._focusing = true
                vm._placeholderVisible = false
            }
            vm._blur = function(){
                vm._focusing = false
                if(vm.value === ""){
                    vm._placeholderVisible = true
                }
            }
            vm._hover = function(){
                if(!vm.disabled){
                    vm._hovering = true
                }
            }

            var maindom = avalon.superGetElementByAttr('avalonctrl');
            var mainvmid = "";
            if(vm.designatedoutervmid && vm.designatedoutervmid != ""){
                mainvmid = vm.designatedoutervmid;
            }else{
                mainvmid = maindom[0].attributes['avalonctrl'].nodeValue;
            }
            var _outervm = avalon.vmodels[mainvmid];

            vm._getValue = function(){
                return _outervm[vm.value]
            }

            if(vm.validation != undefined && vm.validation != ""){
                var _tpcp = null;
                for(var f in vm.$refs){
                    if(f.indexOf('tooltip') != -1){
                        _tpcp = vm.$refs[f];
                        _tpcp.showflag = false;
                        break;
                    }
                }
                vm.validating = function(ev){
                    if(_outervm){
                        vm.valiinput(_tpcp,vm.validation,_outervm[vm.value]);
                    }else{
                        vm.valiinput(_tpcp,vm.validation,vm.value);
                    }
                    if(ev){
                        ev.stopPropagation();
                    }
                }
                if(_outervm){
                    vm._setValue = function(vl){
                        _outervm[vm.value] = vl;
                    }
                }else{
                    vm._setValue = function(vl){
                        vm.value = vl;
                    }
                }
                if(_outervm[vm.value] != undefined){
                    vm._inputClick = function(e){
                        vm.valiinput(_tpcp,vm.validation,_outervm[vm.value]);
                        e.stopPropagation();
                    }
                    _outervm.$watch(vm.value, function(data) {
                        vm.valiinput(_tpcp,vm.validation,data);
                    });
                }else{
                    vm._inputClick = function(e){
                        vm.valiinput(_tpcp,vm.validation,vm.value);
                        e.stopPropagation();
                    }
                    vm.$watch(vm.value, function(data) {
                        vm.valiinput(_tpcp,vm.validation,data);
                    });
                }

            }
        }
    })

    function nextElementSibling( el ) {
        do { el = el.nextSibling } while ( el && el.nodeType !== 1 );
        return el;
    }
    return avalon;
})
